<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<header class="layui-header header" th:fragment="header">
    <div>
        <div class="main">
            <ul th:if="${user!=null}" class="layui-nav layui-nav-left" lay-filter="filter">
                <a class="logo" href="/ss/index" title="StudentSystem">学生社团系统</a>
                <li id='nava-item-0' class="layui-nav-item nav-left">
                    <a href="/ss/index">社团</a>
                </li>
                <li id='nava-item-1' th:unless="${user.getRole().equals('admin')}" class="layui-nav-item ">
                    <a href="/ss/my_associations">我的社团</a>
                </li>
                <li id='nava-item-2' class="layui-nav-item">
                    <a href="/ss/activities">活动</a>
                </li>
                <li id='nava-item-3' th:if="${user.getRole().equals('admin')}" class="layui-nav-item">
                    <a href="/ss/users">用户</a>
                </li>
                <li id='nava-item-4' th:if="${user.getRole().equals('admin')}" class="layui-nav-item">
                    <a href="/ss/finances">财务</a>
                </li>
                <li id='nava-item-5' th:if="${user.getRole().equals('admin') || user.getRole().equals('master')}"
                    class="layui-nav-item ">
                    <a href="/ss/applies">申请</a>
                </li>
            </ul>
            <ul th:if="${user != null}" class="layui-nav layui-layout-right layui-nav-right" lay-filter="filter">
                <a style="margin-top: 10px;cursor: auto;" class="layui-btn layui-btn-warm"
                   th:text="${T(io.github.harmonly.util.RoleUtil).getName(user)}"></a>
                <li style="cursor: pointer" class="layui-nav-item">
                    <a style="display: flex" onclick="show()">
                        <img style="align-self: center" th:src="${user.getFace()}" class="layui-nav-img">
                        <p th:text="${user.getName()}"></p>
                        <span id="pointer" class="layui-nav-more"></span>
                    </a>
                    <dl id="user-list" class="layui-nav-child">
                        <dd><a th:href="'/ss/user/center?uid=' + ${user.getUid()}">用户中心</a></dd>
                        <dd><a href="/ss/logout">退出</a></dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>
    <script type="text/javascript">
        function show() {
            var pointer = document.getElementById('pointer');
            var list = document.getElementById('user-list');
            if (pointer.classList.contains('layui-nav-mored')) {
                pointer.classList.remove('layui-nav-mored')
                list.classList.remove('layui-show')
                return
            }
            pointer.classList.add('layui-nav-mored')
            list.classList.add('layui-show')
        }
    </script>
</header>

<div class="footer" th:fragment="footer">
</div>